<!DOCTYPE HTML>

<html>
	<head>
		<title>课程数据测试</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
		<link rel="icon" type="image/x-icon" href="favicon.ico" />
		<link rel="stylesheet" href="assets/css/main.css" />
		<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
	</head>
	<body class="is-preload">

		<!-- Header -->
			<header id="header">
				<h1>Hello, this is Bule.</h1>
				<nav>
					<ul>
						<li><a href="#intro">intro</a></li>
						<li><a href="#one">What I Do</a></li>
						<li><a href="#two">Who I Am</a></li>
						<li><a href="#work">My Work</a></li>
					</ul>
				</nav>
			</header>

		<!-- Intro -->
			<section id="intro" class="main style1 dark fullscreen">
				<div class="content">
					<header>
						<h2>Hey.</h2>
					</header>
					<p>Welcome to <strong>Blue's</strong> personal website.<br />
					If you prefer, you can browse my related information and works from here.</p>
					<footer>
						<a href="#one" class="button style2 down">More</a>
					</footer>
				</div>
			</section>

		<!-- One -->
			<section id="one" class="main style2 right dark fullscreen">
				<div class="content box style2">
					<header>
						<h2>What I Do</h2>
					</header>
					
					<p>I am mainly engaged in the design and development of some simple application software,
						especially multimedia programs and computer virtual reality games. 
						My works have won the national first prize of the China Computer Design Competition 
						and the provincial first prize. The rest of the time, I am passionate about 
						photography and try to take delightful photos.</p>
				</div>
				<a href="#two" class="button style2 down anchored">Next</a>
			</section>

		<!-- Two -->
			<section id="two" class="main style2 left dark fullscreen">
				<div class="content box style2">
					<header>
						<h2>Who I Am</h2>
					</header>
					<p>I am a junior, studying software engineering at Hangzhou Normal University. 
						Love the mystery of computers, love the fun of photography,
						 like exploring, learning, and discovering and creating new worlds.</p>
				</div>
				<a href="#work" class="button style2 down anchored">Next</a>
			</section>

		<!-- Work -->
			<section id="work" class="main style3 primary">
				<div class="content">
					<header>
						<h2>My Work</h2>
						<p>In the following modules, I will update my photography from time to time.<br/>
							 I am honored that you are willing to browse my work.</p>
					</header>
					
					<!-- Gallery  -->
						<div class="gallery">
							<article class="from-left">
								<a href="https://z3.ax1x.com/2021/08/31/haOQH0.jpg" class="image fit"><img src="https://z3.ax1x.com/2021/08/31/ha7NPH.jpg" title="The Old Street" alt="" /></a>
							</article>
							<article class="from-right">
								<a href="https://z3.ax1x.com/2021/08/31/haOKun.jpg" class="image fit"><img src="https://z3.ax1x.com/2021/08/31/ha7GVO.jpg" title="Lego" alt="" /></a>
							</article>
							<article class="from-left">
								<a href="https://z3.ax1x.com/2021/08/31/haO1EV.jpg" class="image fit"><img src="https://z3.ax1x.com/2021/08/31/ha7YIe.jpg" title="West Lake Lotus Pond" alt="" /></a>
							</article>
							<article class="from-right">
								<a href="https://z3.ax1x.com/2021/08/31/haOMBq.jpg" class="image fit"><img src="https://z3.ax1x.com/2021/08/31/ha7JaD.jpg" title="The West Lake" alt="" /></a>
							</article>
							<article class="from-left">
								<a href="https://z3.ax1x.com/2021/08/31/haOnjs.jpg" class="image fit"><img src="https://z3.ax1x.com/2021/08/31/ha73qK.jpg" title="Phoenix Lake" alt="" /></a>
							</article>
							<article class="from-right">
								<a href="https://z3.ax1x.com/2021/08/31/haO84U.jpg" class="image fit"><img src="https://z3.ax1x.com/2021/08/31/ha7aRA.jpg" title="Creativity: Explosion" alt="" /></a>
							</article>
							<!-- <article class="from-left">
								<a href="images/fulls/07.jpg" class="image fit"><img src="images/thumbs/07.jpg" title="Title" alt="" /></a>
							</article>
							<article class="from-right">
								<a href="images/fulls/08.jpg" class="image fit"><img src="images/thumbs/08.jpg" title="Title" alt="" /></a>
							</article> -->
						</div>

				</div>
			</section>

		<!-- Contact -->
			<!-- <section id="contact" class="main style3 secondary">
				<div class="content">
					<header>
						<h2>Say Hello.</h2>
						<p>Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum.</p>
					</header>
					<div class="box">
						<form method="post" action="#">
							<div class="fields">
								<div class="field half"><input type="text" name="name" placeholder="Name" /></div>
								<div class="field half"><input type="email" name="email" placeholder="Email" /></div>
								<div class="field"><textarea name="message" placeholder="Message" rows="6"></textarea></div>
							</div>
							<ul class="actions special">
								<li><input type="submit" value="Send Message" /></li>
							</ul>
						</form>
					</div>
				</div>
			</section> -->

		<!-- Footer -->
			<footer id="footer">

				<!-- Icons -->
					<ul class="icons">
						<li><a href="#intro" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
						<li><a href="#intro" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
						<li><a href="#intro" class="icon brands fa-instagram"><span class="label">Instagram</span></a></li>
						<li><a href="#intro" class="icon brands fa-linkedin-in"><span class="label">LinkedIn</span></a></li>
						<li><a href="#intro" class="icon brands fa-dribbble"><span class="label">Dribbble</span></a></li>
						<li><a href="#intro" class="icon brands fa-pinterest"><span class="label">Pinterest</span></a></li>
					</ul>

				<!-- Menu -->
					<ul class="menu">
						<li><a href="./file/guide.html">相关文档</a></li>
						<li>版权所有&nbsp;&copy;&nbsp杨琦浩</li><li><a href="https://beian.miit.gov.cn">浙ICP备2021021548号-1</a></li>
					</ul>

			</footer>

		<!-- Scripts -->
			<script src="assets/js/jquery.min.js"></script>
			<script src="assets/js/jquery.poptrox.min.js"></script>
			<script src="assets/js/jquery.scrolly.min.js"></script>
			<script src="assets/js/jquery.scrollex.min.js"></script>
			<script src="assets/js/browser.min.js"></script>
			<script src="assets/js/breakpoints.min.js"></script>
			<script src="assets/js/util.js"></script>
			<script src="assets/js/main.js"></script>
			<script src="assets/js/myScript.js"></script>

	</body>
</html>